import React from "react";
import { Card } from "antd";
import "antd/es/card/style/css";

const { Meta } = Card;
const cardStyle = {
  width: 240,
  float: "left",
  marginRight: 20,
  marginBottom: 20,
};

export default () => (
  <div>
    <Card
      hoverable
      style={cardStyle}
      cover={
        <img
          className="product-img"
          alt="example"
          src="https://img3.doubanio.com/view/photo/s_ratio_poster/public/p2648230660.jpg"
        />
      }
    >
      <Meta
        title="情书"
        description="https://movie.douban.com/subject/1292220/"
      />
    </Card>
    <Card
      hoverable
      style={cardStyle}
      cover={
        <img
          className="product-img"
          alt="example"
          src="https://img1.doubanio.com/view/photo/s_ratio_poster/public/p1446261379.jpg"
        />
      }
    >
      <Meta
        title="天空之城"
        description="https://movie.douban.com/subject/1291583/"
      />
    </Card>
    <Card
      hoverable
      style={cardStyle}
      cover={
        <img
          className="product-img"
          alt="example"
          src="https://img1.doubanio.com/view/photo/s_ratio_poster/public/p1867084027.jpg"
        />
      }
    >
      <Meta
        title="疯狂原始人"
        description="https://movie.douban.com/subject/1907966/"
      />
    </Card>
  </div>
);
